<div id="content_header">
  <h3>{{ currentTeacher.Name }} Editing</h3>
</div>

<div class="row">
  <div class="col-md-6 col-lg-4">
    <form name="studentForm" role="form" ng-submit="update()">

      <div class="form-group" ng-class="{ 'has-error': errors.Name}">
        <label class="required" for="Name">Name</label>
        <input type="text" name="Name" class="form-control" id="Name" placeholder="Input field" ng-model="item.Name" required>
        <error-widget field="errors.Name"></error-widget>
      </div>

      <div class="form-group" ng-class="{ 'has-error': errors.Code}">
      <label class="required" for="Code">Code</label>
        <input type="text" name="Code" class="form-control" id="Code" placeholder="Input field" ng-model="item.Code" required>
        <error-widget field="errors.Code"></error-widget>
      </div>

      <div class="form-group" ng-click="openDatepicker($event, 0)"  ng-class="{ 'has-error': errors.DoB}">
        <label class="required" for="">Date of Birth</label>
        <div class="row">
          <div class="col-xs-12 col-sm-12 col-md-8 col-lg-6">
            <div class="input-group">
              <input type="hidden" class="form-control" datepicker-popup="{{format}}" ng-model="item.DoB" is-open="datePicker.isOpen[0]" datepicker-options="dateOptions" ng-required="true" close-text="Close" ng-disabled="true" required />
              <input type="text" class="form-control" ng-disabled="true" ng-value="item.DoB | date: 'dd MMMM yyyy'">
              <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i> </span>
            </div>
          </div>
        </div>
        <error-widget field="errors.DoB"></error-widget>
      </div>

      <div class="form-group" ng-class="{ 'has-error': errors.Sex}">
        <label class="required" for="optionsRadios">Gender</label><br>
        <label ng-repeat="sex in Sexes" class="radio-inline">
          <input type="radio" name="optionsRadios" id="optionsRadios{{ sex.Id }}" ng-value="{{ sex.Id }}" ng-model="item.Sex"> {{ sex.Label }}
        </label>
        <error-widget field="errors.Sex"></error-widget>
      </div>

      <div class="form-group" ng-class="{ 'has-error': errors.StaffType}">
      <label class="required" for="StaffType">Teacher Type</label>
        <div class="row">
          <div class="col-xs-12 col-sm-12 col-md-9 col-lg-7">
          <select name="StaffType" id="StaffType" class="form-control" ng-model="item.StaffType" ng-options="StaffType.Id as StaffType.Name for StaffType in StaffTeacherTypes" required>
          <option value="" ng-hide="item.StaffType > 0">Select an type</option>
            </select>
          </div>
        </div>
        <error-widget field="errors.StaffType"></error-widget>
      </div>

      <div class="row">
        <div class="col-xs-12 col-sm-12 col-md-12 col-lg-6">
          <div class="form-group" ng-class="{ 'has-error': errors.IsValid}">
            <label for="IsValid">
              Validity
              <input type="checkbox" name="IsValid" id="IsValid" ng-model="item.IsValid">
            </label>
            <error-widget field="errors.IsValid"></error-widget>
          </div>
        </div>
      </div>

      <button type="submit" class="btn btn-primary" >Submit</button>
    </form>
    
  </div>
</div>